import React,{Component} from 'react';
import './fileAuth.scss';
import {
  Link
} from 'react-router-dom';
import { getRealCertInfo } from 'api/company.js';
export default class FileAuth extends Component{
	constructor (props) {
		super(props)
		this.state={
			auth_info: {},
			time: '',
			showImg: '',
			imgShow: false
		}
	}
	timestampToTime (timestamp) { //解析时间戳
    var date = new Date(timestamp * 1000);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
    var Y = date.getFullYear() + '年';
    var M = (date.getMonth()+1 < 10 ? '0'+(date.getMonth()+1) : date.getMonth()+1) + '月';
    var D = date.getDate() + '日';
    this.setState({
    	time: Y+M+D
    })
  }
  imgShowBig (img) {
  	this.setState({
  		imgShow: true,
  		showImg: img
  	})
  }
  hideImg () {
  	this.setState({
  		imgShow: false
  	})
  }
	componentWillMount () {
		getRealCertInfo({ //店铺实名认证数据接口
			shop_id: this.props.shop_id
		}).then(res => {
			if(res.code === 1){
				this.setState({
					auth_info:res.data
				},()=>{
					this.timestampToTime (this.state.auth_info.business_start_time)
				})
			}
		})
	}
	render () {
		return(
			<div>
				{
					this.state.auth_info.shop_business === 0 ?
					<div className="fileAuth">
					{
						this.state.auth_info.auth_type === 'realname_auth' ?
						<div className="certification">
							<i className="glyphicon glyphicon-certification active"></i>
							实名认证：<span className="active">[已认证]</span>
						</div>
						:
						<div className="certification">
							<i className="glyphicon glyphicon-certification"></i>
							实名认证：<span>[未认证]</span>
						</div>
					}
						
						<div className="auth_con auth_user">
							<div><p>店主姓名：{this.state.auth_info.contacts_name}</p></div>
							<div><p>身份证号码：{this.state.auth_info.contacts_person_number}</p></div>
							<div><p>身份证有效期：{this.state.auth_info.contact_person_expires}</p></div>
							<div><p>联系地址：{this.state.auth_info.contacts_address}</p></div>
							<div><p>邮箱：{this.state.auth_info.contacts_email}</p></div>
							<div><p>电话：{this.state.auth_info.contacts_phone}</p></div>
							<p className="auth_til">*上述认证信息由北京盘石信用管理有限公司提供
								{
									this.state.auth_info.auth_type === 'realname_auth' ?
									<img src="../../../../../images/shop/gaizhang.png"/>
									: ''
								}
							</p>
						</div>
					</div>
					: this.state.auth_info.shop_business === 1 ?
					<div className="fileAuth">
					{
						this.state.auth_info.auth_type === 'realname_auth' ?
						<div className="certification">
							<i className="glyphicon glyphicon-certification active"></i>
							实名认证：<span className="active">[已认证]</span>
							<Link to={
								{
									pathname:'/company/auth',
									state:{shop_id:this.props.shop_id}
								}
							}>
							<span className="auth_del">【查看详细档案信息】</span>
							</Link>
						</div>
						:
						<div className="certification">
							<i className="glyphicon glyphicon-certification"></i>
							实名认证：<span>[未认证]</span>
						</div>
					}
						<div className="auth_con">
							<div><span>公司名称：</span><p>{this.state.auth_info.shop_company_name}</p></div>
							<div><span>注册资本：</span><p>{this.state.auth_info.company_registered_capital}万元</p></div>
							<div><span>注册地址：</span><p>{this.state.auth_info.company_address_detail}</p></div>
							<div><span>成立日期：</span><p>{this.state.auth_info.establish_date}</p></div>
							<div><span>公司类型：</span><p>{this.state.auth_info.company_type_desc}</p></div>
							<div><span>经营范围：</span><p>{this.state.auth_info.business_sphere}</p></div>
							<p className="auth_til">*上述认证信息由北京盘石信用管理有限公司提供</p>
						</div>
						<div className="auth_aptitude">
							<p>
								<i className="glyphicon glyphicon-aptitude"></i>企业资质
							</p>
							<div className="auth_zizhi">
								<div>
								{
									this.state.auth_info.business_license_electronic === '' || this.state.auth_info.business_license_electronic === ' '?
									<img src="../../../../../images/default/资质.png"/>
									: <img src={this.state.auth_info.business_license_electronic} onClick={this.imgShowBig.bind(this, this.state.auth_info.business_license_electronic)}/>
								}
									<br/>
									<span>公司营业执照</span>
								</div>
								<div>
								{
									this.state.auth_info.special_indus_qua === '' ?
									<img src="../../../../../images/default/资质.png"/>
									: <img src={this.state.auth_info.special_indus_qua} onClick={this.imgShowBig.bind(this, this.state.auth_info.special_indus_qua)}/>
								}
									<br/>
									<span>特殊行业资质</span>
								</div>
							</div>
						</div>
					</div>
					: ''
				}
				{this.state.imgShow ? <div className='imgShow' onClick={this.hideImg.bind(this)}>
					<img src={this.state.showImg} />
				</div> : ''}
			</div>
		)
	}
}

